import React, { useState, useEffect } from 'react';
import { Link, Routes, Route, matchRoutes, useLocation } from 'react-router-dom';
// import { useRouteMatch } from 'react-router-dom';

function Home() {
    // console.log(props);
    let location = useLocation();
    console.log(location);

    const [count, setCount] = useState(0);
    
    const addCount = () => {
        setCount(count + 1);
    };

    useEffect(() => {
        console.log('useEffect');
    }, [count]);

    return (
        <>
            <h1>首页</h1>
            <p>当前点击次数:{count}</p>
            <button onClick={ addCount }>加一</button>
            {/* <ul>
                <li><Link to={`${match.url}/m1`}>模块1</Link></li>
                <li><Link to={`${match.url}/m2`}>模块2</Link></li>
                <li><Link to={`${match.url}/m3`}>模块3</Link></li>
            </ul>
            <Routes>
                <Route path={`${match.url}/m1`}>
                    <div>模块一的内容</div>
                </Route>
                <Route path={`${match.url}/m2`}>
                    <div>模块二的内容</div>
                </Route>
                <Route path={`${match.url}/m3`}>
                    <div>模块三的内容</div>
                </Route>
            </Routes> */}
        </>
    );
}

export default Home;
